---
layout: default
---

<div class="container">
    <div class="row single-page">
        <div class="d-none col-lg-2 d-lg-block">
        </div>

        <div class="col-lg-7" role="navigation" aria-label="Main">
            <h1>{{ page.schemaTitle }}</h1>

            <div class="d-block d-lg-none dap-sidebar">
                {% for toc-l1 in site.data.specification-toc %}
                <div class="card">
                    <div id="outlineAccordion-inline" data-children=".item">
                        {% for toc-l2 in toc-l1.children %}
                        <div class="item">
                            <a class="nav-link" data-toggle="collapse" data-parent="#outlineAccordion-inline" href="#{{ toc-l2.anchor }}-inline" aria-expanded="true">
                                {{ toc-l2.title }}
                            </a>
                            <div id="{{ toc-l2.anchor }}-inline" class="collapse" role="tabpanel">
                                <ul class="nav toc flex-column" style="padding-left: 0.5rem">
                                    {% for toc-l3 in toc-l2.children %}
                                    <li class="nav-item">
                                        <a class="nav-link toc-link" href="#{{ toc-l3.anchor }}">
                                            {{ toc-l3.title }}
                                        </a>
                                    </li>
                                    {% endfor %}
                                </ul>
                            </div>
                        </div>
                        {% endfor %}
                    </div>
                </div>
                {% endfor %}
            </div>

            <div id="markdown-content-container">{{ content }}</div>
        </div>

        <div class="d-none col-lg-3 d-lg-block dap-sidebar">
            {% for toc-l1 in site.data.specification-toc %}
            <div class="card">
                <div id="outlineAccordion-side" data-children=".item">
                    {% for toc-l2 in toc-l1.children %}
                    <div class="item">
                        <a class="nav-link" data-toggle="collapse" data-parent="#outlineAccordion-side" href="#{{ toc-l2.anchor }}-side" aria-expanded="true">
                            {{ toc-l2.title }}
                        </a>
                        <div id="{{ toc-l2.anchor }}-side" class="collapse" role="tabpanel">
                            <ul class="nav toc flex-column" style="padding-left: 0.5rem">
                                {% for toc-l3 in toc-l2.children %}
                                <li class="nav-item">
                                    <a class="nav-link toc-link" href="#{{ toc-l3.anchor }}">
                                        {{ toc-l3.title }}
                                    </a>
                                </li>
                                {% endfor %}
                            </ul>
                        </div>
                    </div>
                    {% endfor %}
                </div>
            </div>
            {% endfor %}
        </div>
    </div>
</div>
